$color-red: #ff5668;
$color-white: #fff;
$color-grey: #f8f8f8;
$color-font: #333;
page {
	height: 100%;
	background-color: $color-grey;
	overflow: hidden;
}
view,
input,
::after,
::before {
	box-sizing: border-box;
}
view {
	color: $color-font;
}
text {
	color: inherit;
}
.container {
	width: 100%;
	height: 100%;
	overflow: auto;
}
.flex {
	display: flex;
}
.flexjus {
	display: flex;
	justify-content: space-between;
}
.flex-column {
	-webkit-flex-direction: column;
	flex-direction: column;
}
.flex-center {
	display: flex;
	justify-content: center;
	align-items: center;
}
.flex-align-center {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.noScrollBar::-webkit-scrollbar,
.noScrollBar::-webkit-scrollbar-thumb {
	width: 0;
	height: 0;
	opacity: 0;
	background-color: transparent;
	display: none;
}

/* 自定义头部 */
.header {
	position: relative;
	z-index: 1;
	width: 100%;
	height: 460rpx;
	background: linear-gradient(270deg, #fe487f 0%, $color-red 100%); /* 设置容器背景色 */
	&::before {
		content: '';
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
		height: 38rpx; /* 你可以根据需要调整这个高度来改变弧形的程度 */
		background: inherit; /* 继承父容器的背景色 */
		border-bottom-left-radius: 100%; /* 左侧底边弧度 */
		border-bottom-right-radius: 100%; /* 右侧底边弧度 */
		transform: translateY(50%); /* 将弧形部分移动到容器的底部 */
		transform-origin: bottom center; /* 设置变换的原点在弧形部分的底部中心 */
		z-index: 20;
	}
	.back {
		position: absolute;
		left: 32rpx;
		z-index: 2;
	}
	.title {
		font-size: 32rpx;
		text-align: center;
		color: #fff;
	}
	.content {
		display: flex;
		justify-content: space-between;
		padding: 20rpx 40rpx 0;
		color: #fff;
		.userinfo {
			display: flex;
			.head {
				width: 120rpx;
				height: 120rpx;
				image {
					width: 100%;
					height: 100%;
				}
			}
			.info {
				padding-left: 20rpx;
			}
			.name {
				display: flex;
				align-items: center;
				height: 60rpx;
				color: $color-white;
			}
			.first {
				font-size: 40rpx;
			}
			.tag {
				padding: 0 12rpx;
				font-size: 28rpx;
			}
			.subname {
				padding-top: 12rpx;
				line-height: 42rpx;
				font-size: 28rpx;
				color: $color-white;
			}
		}
	}
	.left {
		.subtitle {
			line-height: 60rpx;
			font-size: 40rpx;
			color: $color-white;
		}
		.subcontent {
			line-height: 48rpx;
			font-size: 28rpx;
			color: $color-white;
		}
	}
	.right {
		padding-right: 4rpx;
		.icon {
			width: 102rpx;
			height: 102rpx;
		}
	}
}
.footer {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 176rpx;
	padding: 24rpx 28rpx 66rpx;
	background: $color-white;
	.btn-group-right {
		display: flex;
		justify-content: flex-end;
		align-items: center;
		.btn {
			padding: 20rpx 32rpx;
			border: 2rpx solid #e7e7e7;
			border-radius: 43rpx;
			font-size: 30rpx;
			color: $color-red;
			& + .btn {
				margin-left: 30rpx;
			}
		}
		.red {
			background-color: $color-red;
			color: $color-white;
		}
	}
}
/*按钮公共样式*/
.btn-submit {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 96rpx;
	background: #e94968;
	border-radius: 48rpx;
	font-size: 30rpx;
	color: $color-white;
}
.btn-default {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 82rpx;
	background: $color-white;
	border-radius: 40rpx;
	border: 2rpx solid #e7e7e7;
	font-size: 28rpx;
	color: #19233d;
}
.btn-disable {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 96rpx;
	background: #c6c6c6;
	border-radius: 48rpx;
	font-size: 30rpx;
	color: $color-white;
}
/* 登录页面样式 */
.login-warp {
	padding-top: 60rpx;
	.login-title {
		line-height: 66rpx;
		font-size: 44rpx;
		color: #000;
		text-align: center;
	}
	.uni-forms {
		padding: 82rpx 100rpx;
	}
	.uni-forms-item {
		margin-bottom: 0;
	}
	.form-item {
		display: flex;
		align-items: center;
		padding: 40rpx 0;
		border-bottom: 2rpx solid #e9e9e9;
	}
	.dataSelect {
		width: 120rpx;
		.uni-select {
			border: none;
		}
	}
	.input {
		flex: 1;
		width: 80%;
		height: 48rpx;
	}
	.yan {
		color: #9c9c9c;
	}
	.code {
		font-size: 28rpx;
		color: $color-red;
	}
	.uni-data-checklist .checklist-group .checklist-box {
		margin: 0;
		.radio__inner {
			width: 20px;
			height: 20px;
			border-color: $color-red;
		}
	}
	.radio-group {
		.label {
			white-space: nowrap;
		}
		.radio {
			transform: scale(0.8);
		}
	}
	.xieyi {
		flex: 1;
		width: 100%;
		height: 48rpx;
		font-size: 28rpx;
		color: #9c9c9c;
		white-space: nowrap;
		.text {
			color: #424e75;
		}
	}
	.noBoder {
		border: none;
	}
	.submit {
		width: 100%;
		height: 108rpx;
		line-height: 108rpx;
		border: none;
		margin-top: 40rpx;
		background-color: $color-red;
		border-radius: 54rpx;
		font-size: 32rpx;
		color: #fff;
	}
}
.main {
	position: relative;
	z-index: 1;
	margin-top: -110rpx;
	padding: 0 24rpx;
}
.warp {
	padding: 0 24rpx;
}
.tabs {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	height: 70rpx;
	padding: 0 28rpx;
	background-color: $color-white;
	.left {
		display: flex;
		align-items: center;
	}
	&-item {
		position: relative;
		margin-right: 40rpx;
		font-size: 28rpx;
		color: #9c9c9c;
		z-index: 1;
	}
	.current {
		color: $color-red;
		&::after {
			position: absolute;
			left: 50%;
			bottom: -16rpx;
			content: '';
			width: 44rpx;
			height: 4rpx;
			transform: translate(-50%, 0);
			background-color: $color-red;
			color: $color-red;
			z-index: 2;
		}
	}
	.right {
		.tabs-item {
			margin-right: 0;
		}
	}
	.date {
		position: relative;
		padding-right: 20rpx;
		z-index: 1;
		&::after {
			position: absolute;
			right: 0;
			top: 12rpx;
			content: '';
			border-top: 14rpx solid #333;
			border-left: 8rpx solid transparent;
			border-right: 8rpx solid transparent;
			border-bottom: 0 solid transparent;
			z-index: 2;
		}
	}
	.date2 {
		position: absolute;
		top: 0;
		z-index: 3;
	}
}
.block-item {
	padding: 32rpx;
	background: $color-white;
	border-radius: 32rpx;
	margin-bottom: 20rpx;
	overflow: hidden;
	.block {
		flex: 1;
		width: 50%;
		text-align: center;
	}
	.money {
		height: 78rpx;
		line-height: 56rpx;
		font-size: 48rpx;
		color: $color-red;
	}
	.msg {
		display: flex;
		justify-content: center;
		align-items: center;
		height: 42rpx;
		font-size: 28rpx;
		color: $color-font;
	}
	.verticalLine {
		width: 2rpx;
		height: 56rpx;
		background-color: #d9d9d9;
	}
	.pink {
		display: flex;
		justify-content: space-around;
		align-items: center;
		padding: 26rpx;
		margin-bottom: 32rpx;
		background-color: #ffeff2;
		border-radius: 24rpx;
		text-align: center;
	}
	.center {
		.money {
			height: 54rpx;
			line-height: 42rpx;
			font-size: 32rpx;
			color: $color-font;
			font-weight: bold;
		}
		.subtitle {
			height: 42rpx;
			line-height: 42rpx;
			color: $color-font;
			font-size: 28rpx;
		}
	}
	.progressBar {
		padding-bottom: 20rpx;
	}
	.flexjus {
		padding-bottom: 20rpx;
		.content {
			font-size: 24rpx;
			color: #6c7590;
		}
		.red {
			font-size: 24rpx;
			color: $color-red;
			& + .red {
				margin-left: 34rpx;
			}
		}
	}
	.userInfo {
		height: 54rpx;
		font-size: 28rpx;
		color: #000;
		line-height: 44rpx;
	}
	.address {
		height: 54rpx;
		font-size: 24rpx;
		color: #999;
		line-height: 44rpx;
	}
	.text {
		line-height: 32rpx;
		font-size: 24rpx;
		color: #999;
	}
	.item {
		display: flex;
		align-items: center;
		height: 42rpx;
		line-height: 42rpx;
		margin: 0 30rpx;
		font-size: 28rpx;
		.numbox {
			position: relative;
			margin: 0 6rpx;
			height: 42rpx;
			z-index: 1;
			&::before {
				position: absolute;
				left: 0;
				top: -40rpx;
				content: '';
				width: 300%;
				height: 40rpx;
				z-index: 20;
				background: linear-gradient(to bottom, #fff 50%, rgba(255, 255, 255, 0));
			}
			&::after {
				position: absolute;
				left: 0;
				bottom: -40rpx;
				content: '';
				width: 300%;
				height: 40rpx;
				z-index: 20;
				background: linear-gradient(to top, #fff 50%, rgba(255, 255, 255, 0));
			}
			.numwarp {
				position: absolute;
				left: 0;
				top: 0;
				width: 100%;
				height: 100%;
				z-index: 10;
			}
			.red {
				height: 42rpx;
				line-height: 42rpx;
				color: $color-red;
			}
		}
	}
	.tab {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 100%;
		height: 90rpx;
		margin-bottom: 32rpx;
		border-radius: 24rpx;
		background-color: #e9e9e9;
		overflow: hidden;
		.tab-item {
			display: flex;
			justify-content: center;
			align-items: center;
			width: 50%;
			height: 100%;
			font-size: 28rpx;
			color: $color-font;
		}
		.current {
			background-color: $color-red;
			color: $color-white;
		}
	}
	.tabs {
		height: 54rpx;
		padding: 0;
		.tabs-item {
			display: flex;
			justify-content: center;
			align-items: center;
			height: 100%;
			padding: 0 24rpx;
			margin: 0;
			font-size: 28rpx;
			color: #6c7590;
			white-space: nowrap;
		}
		.current {
			border-radius: 27rpx;
			background-color: $color-red;
			color: $color-white;
		}
	}
	.timeRange {
		padding: 16rpx 0;
		font-size: 24rpx;
		text-align: center;
	}
	.list {
		margin: 0 -32rpx;
		&-item {
			padding: 28rpx;
			background-color: $color-white;
			border-radius: 20rpx;
			margin-bottom: 20rpx;
		}
		.left {
			display: flex;
		}
		.head {
			width: 60rpx;
			height: 60rpx;
			border-radius: 50%;
			overflow: hidden;
			image {
				width: 100%;
				height: 100%;
			}
		}
		.img {
			width: 80rpx;
			height: 80rpx;
			border-radius: 10rpx;
			background-color: #eee;
			overflow: hidden;
			image {
				width: 100%;
				height: 100%;
			}
		}
		.info {
			padding-left: 20rpx;
			.top {
				display: flex;
				align-items: start;
			}
		}
		.name {
			height: 46rpx;
			line-height: 28rpx;
			font-size: 28rpx;
		}
		.tag {
			margin-left: 8rpx;
			padding: 4rpx 8rpx;
			line-height: 22rpx;
			background-color: rgba(43, 176, 67, 0.1);
			border-radius: 4rpx;
			color: #20a839;
			font-size: 20rpx;
		}
		.mobile {
			line-height: 30rpx;
			font-size: 24rpx;
		}
		.money {
			height: 46rpx;
			line-height: 42rpx;
			font-size: 24rpx;
			font-weight: bold;
			text-align: right;
		}
		.time {
			line-height: 30rpx;
			font-size: 24rpx;
			color: #9c9c9c;
		}
	}
	.label {
		height: 62rpx;
		font-size: 28rpx;
		color: #000;
		.suffix {
			color: $color-red;
		}
	}
	.input {
		flex: 1;
		height: 70rpx;
		.uni-select {
			border: none;
		}
	}
	.input-warp {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 12rpx 28rpx;
		background-color: #f5f7fa;
		border-radius: 32rpx;
		margin-bottom: 32rpx;
	}
	.saoma {
		width: 48rpx;
		height: 48rpx;
	}
}
.menu {
	padding: 32rpx 40rpx;
	background: $color-white;
	border-radius: 32rpx;
	margin-bottom: 20rpx;
	overflow: hidden;
	&-box {
		margin: 0 -40rpx;
		display: flex;
		flex-wrap: wrap;
	}
	&-item {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		width: 25%;
		margin-bottom: 32rpx;
		&:nth-of-type(4) {
			margin-right: 0;
		}
	}
	.icon {
		width: 60rpx;
		height: 60rpx;
	}
	.name {
		font-size: 24rpx;
		text-align: center;
	}
}
.noBackgroundColor {
	background-color: transparent;
}
.table {
	width: 100%;
	.thead {
		display: flex;
		padding-bottom: 24rpx;
		.th {
			width: 33%;
			line-height: 36rpx;
			font-size: 24rpx;
			color: #9c9c9c;
			text-align: center;
		}
	}
	.tbody {
		.tr {
			display: flex;
			padding-bottom: 32rpx;
			.td {
				width: 33%;
				line-height: 36rpx;
				font-size: 28rpx;
				text-align: center;
				color: $color-font;
			}
			.one {
				text-align: left;
			}
			.three {
				color: $color-red;
			}
		}
	}
}
/* 自定义弹窗样式 */
.popup-container {
	width: 600rpx;
	padding: 32rpx;
	margin: 0 auto;
	background-color: #fff;
	border-radius: 20rpx;
	.popup-title {
		padding: 20rpx 0;
		line-height: 56rpx;
		font-size: 32rpx;
		font-weight: bold;
		text-align: center;
	}
	.popup-content {
		padding: 26rpx 60rpx 60rpx;
		line-height: 48rpx;
		font-size: 32rpx;
		text-align: center;
		color: #666;
	}
	.btn-group {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding-top: 32rpx;
	}
	.btn-center {
		display: flex;
		align-items: center;
		justify-content: center;
		padding-top: 32rpx;
	}
	.btn {
		width: 260rpx;
		height: 70rpx;
		line-height: 70rpx;
		font-size: 28rpx;
		text-align: center;
		border-radius: 36rpx;
		& + .btn {
			margin-left: 40rpx;
		}
	}
	.cancel {
		background: #f3f3f3;
		color: #333;
	}
	.confirm {
		background: $color-red;
		color: #fff;
	}
}
.layout {
	padding: 20rpx 28rpx 80rpx;
	.head {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 28rpx;
		margin-bottom: 20rpx;
		background-color: $color-white;
		border-radius: 24rpx;
		.left {
			display: flex;
			align-items: center;
			.pic {
				width: 60rpx;
				height: 60rpx;
				border-radius: 50%;
			}
			.info {
				padding-left: 16rpx;
				.name {
					height: 46rpx;
					line-height: 42rpx;
					font-size: 28rpx;
				}
				.time {
					height: 30rpx;
					line-height: 30rpx;
					font-size: 24rpx;
					color: #9c9c9c;
				}
			}
		}
		.right {
			.num {
				padding-right: 20rpx;
				font-size: 32rpx;
				color: $color-red;
			}
			.tag {
				height: 38rpx;
				padding: 0 8rpx;
				line-height: 34rpx;
				border: 2rpx solid $color-red;
				border-radius: 18rpx;
				font-size: 20rpx;
				color: $color-red;
			}
		}
	}
	.body {
		padding: 28rpx;
		border-radius: 20rpx;
		background-color: $color-white;
		.h3 {
			margin-bottom: 32rpx;
			font-size: 28rpx;
		}
		.msg {
			display: flex;
			justify-content: space-between;
			margin-bottom: 32rpx;
			.label {
				width: 190rpx;
				font-size: 24rpx;
				color: #b9b9bd;
			}
			.text {
				flex: 1;
				font-size: 24rpx;
				color: #666;
				text-align: right;
			}
		}
		.tipMsg {
			padding: 4rpx 140rpx 68rpx 0;
			line-height: 60rpx;
			font-size: 40rpx;
			color: #1c253f;
		}
	}
	.piclist {
		margin-bottom: 32rpx;
		text-align: right;
		.pic {
			width: 96rpx;
			height: 96rpx;
			background: #d9d9d9;
			border-radius: 8rpx;
			& + .pic {
				margin-left: 8rpx;
			}
		}
	}
	.errMsg {
		line-height: 36rpx;
		font-size: 24rpx;
		color: $color-red;
	}
	.divider {
		width: 90%;
		margin: 0 auto;
		border-bottom: 2rpx solid #e7e7e7;
	}
	.list-box {
		margin-bottom: 20rpx;
		background-color: $color-white;
		border-radius: 20rpx;
		overflow: hidden;
		.top {
			padding: 40rpx 34rpx 26rpx;
			.text {
				height: 52rpx;
				line-height: 42rpx;
				font-size: 28rpx;
				color: #717186;
				.label {
					margin-right: 8rpx;
				}
			}
			.money {
				line-height: 72rpx;
				font-size: 56rpx;
			}
			.title {
				height: 68rpx;
				font-size: 32rpx;
				color: #191919;
				line-height: 38rpx;
			}
			.time {
				height: 36rpx;
				font-size: 24rpx;
				color: #b9b9bd;
				line-height: 36rpx;
			}
			.status {
				height: 36rpx;
				font-size: 24rpx;
				color: $color-red;
				line-height: 36rpx;
			}
			.input {
				width: 100%;
				height: 96rpx;
				padding: 0 32rpx;
				margin-bottom: 40rpx;
				background-color: #f5f7fa;
				border-radius: 16rpx;
			}
			.btn {
				display: flex;
				justify-content: center;
				align-items: center;
				width: 100%;
				height: 96rpx;
				background: #e94968;
				border-radius: 48rpx;
				font-size: 30rpx;
				color: #fff;
			}
		}
		.h4 {
			line-height: 48rpx;
			font-size: 32rpx;
			color: #1c253f;
		}
		.copy {
			line-height: 48rpx;
			font-size: 24rpx;
			color: #495564;
		}
		.info {
			display: flex;
			padding: 28rpx;
			.pic {
				width: 174rpx;
				height: 174rpx;
				border-radius: 24rpx;
			}
			.msg {
				flex: 1;
				display: flex;
				flex-direction: column;
				justify-content: space-between;
				padding-left: 28rpx;
			}
			.title {
				line-height: 42rpx;
				font-size: 28rpx;
				color: #191919;
			}
			.content {
				line-height: 36rpx;
				font-size: 24rpx;
				color: #787878;
			}
			.time {
				line-height: 36rpx;
				font-size: 24rpx;
				color: #b9b9bd;
			}
			.status {
				line-height: 36rpx;
				font-size: 24rpx;
				color: $color-red;
			}
		}
		.footer {
			position: static;
			display: flex;
			height: auto;
			padding: 32rpx 34rpx 34rpx;
			border-top: 2rpx solid #f4f4f4;
			.textBtn {
				font-size: 30rpx;
				color: $color-red;
				& + .textBtn {
					margin-left: 56rpx;
				}
			}
			.btn-group-right {
				width: 100%;
				.btn {
					display: flex;
					justify-content: center;
					align-items: center;
					padding: 0 24rpx;
					height: 72rpx;
					border: none;
					background-color: $color-red;
					border-radius: 36rpx;
					font-size: 28rpx;
					color: $color-white;
					& + .btn {
						margin-left: 28rpx;
					}
				}
			}
		}
	}
	.redbox {
		height: 200rpx;
		padding: 40rpx;
		margin-bottom: 20rpx;
		background-color: $color-red;
		border-radius: 32rpx;
		text-align: center;
		.money {
			height: 78rpx;
			line-height: 62rpx;
			font-size: 48rpx;
			color: $color-white;
		}
		.msg {
			height: 42rpx;
			line-height: 42rpx;
			font-size: 28rpx;
			color: $color-white;
		}
	}
	.list-warp {
		padding: 0 28rpx;
		background-color: $color-white;
		border-radius: 24rpx;
		.list-item {
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: 28rpx 0;
			border-bottom: 2rpx solid #e9e9e9;
			&:last-child {
				border-bottom: 0;
			}
			.left {
				display: flex;
				align-items: center;
			}
			.headpic {
				width: 60rpx;
				height: 60rpx;
				border-radius: 50%;
				overflow: hidden;
				.pic {
					width: 100%;
					height: 100%;
				}
			}
			.info {
				padding-left: 20rpx;
				.label {
					display: flex;
					align-items: center;
					padding-bottom: 4rpx;
					.h4 {
						padding-right: 8rpx;
						font-size: 28rpx;
					}
					.tag {
						padding: 4rpx 8rpx;
						border-radius: 12rpx;
						border: 2rpx solid $color-red;
						font-size: 20rpx;
						color: $color-red;
					}
				}
				.mobile {
					line-height: 32rpx;
					font-size: 24rpx;
				}
			}
			.right {
				text-align: right;
			}
			.status {
				height: 44rpx;
				line-height: 36rpx;
				font-size: 24rpx;
				color: $color-red;
			}
			.money {
				height: 46rpx;
				font-size: 24rpx;
				font-weight: bold;
			}
			.money2 {
				height: 42rpx;
				line-height: 44rpx;
				font-size: 32rpx;
			}
			.time {
				font-size: 24rpx;
				color: #9c9c9c;
			}
		}
		.tips {
			padding: 40rpx 0 30rpx;
			font-size: 26rpx;
			color: #717186;
		}
	}
	.btn-group {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding-top: 32rpx;
	}
}
.empty {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	image {
		width: 360rpx;
		height: 240rpx;
		margin-bottom: 48rpx;
	}
	&-tips {
		margin-bottom: 16rpx;
		font-size: 32rpx;
		color: #1c213e;
		& + .empty-tips {
			font-size: 24rpx;
			color: #727687;
		}
	}
}
// 全局页面大按钮，不属于任何组件下面的按钮
.bigBtn {
	position: absolute;
	left: 50%;
	bottom: 80rpx;
	width: 622rpx;
	height: 96rpx;
	line-height: 96rpx;
	background-color: $color-red;
	transform: translate(-50%, 0);
	border-radius: 48rpx;
	font-size: 30rpx;
	text-align: center;
	color: #fff;
	z-index: 20;
}
//物流页面样式
.wuliu {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 32rpx 0 40rpx;
	.info {
		display: flex;
		align-items: center;
		.logo {
			width: 48rpx;
			height: 48rpx;
			border-radius: 50%;
		}
		.name {
			margin-left: 12rpx;
			font-size: 24rpx;
			color: #8a8c8e;
		}
	}
	.line {
		width: 2rpx;
		height: 20rpx;
		margin: 0 14rpx;
		background: #d9d9d9;
	}
	.right {
		display: flex;
		align-items: center;
	}
	.label {
		font-size: 24rpx;
		color: #8a8c8e;
	}
}
.steps {
	padding-bottom: 80rpx;
	.step {
		&:last-child {
			.step-item {
				&:last-child {
					border-left-color: transparent;
				}
				&::before {
					position: absolute;
					left: -1rpx;
					top: 0;
					content: '';
					width: 2rpx;
					height: 16rpx;
					background: #dfdfdf;
					z-index: 2;
				}
			}
		}
		.title {
			display: flex;
			align-items: center;
			margin: 4rpx 0;
		}
		.icon {
			width: 44rpx;
			height: 44rpx;
			border-radius: 50%;
		}
		.name {
			margin-left: 10rpx;
			line-height: 42rpx;
			font-size: 28rpx;
			color: #74757c;
		}
		&-item {
			position: relative;
			z-index: 1;
			border-left: 1rpx solid #dfdfdf;
			padding-left: 32rpx;
			margin-left: 22rpx;
			padding-bottom: 36rpx;
			&::after {
				position: absolute;
				left: -8rpx;
				top: 16rpx;
				content: '';
				width: 16rpx;
				height: 16rpx;
				background: #dfdfdf;
				border-radius: 50%;
				z-index: 2;
			}
			&:first-child {
				&::before {
					position: absolute;
					left: -2rpx;
					top: 0;
					content: '';
					width: 2rpx;
					height: 16rpx;
					background: $color-white;
					z-index: 2;
				}
				&::after {
					position: absolute;
					left: -8rpx;
					top: 16rpx;
					content: '';
					width: 16rpx;
					height: 16rpx;
					background: #dfdfdf;
					border-radius: 50%;
					z-index: 2;
				}
			}
		}
		.content {
			padding-bottom: 10rpx;
			line-height: 36rpx;
			font-size: 24rpx;
			color: #747474;
		}
		.time {
			line-height: 36rpx;
			font-size: 24rpx;
			color: #747474;
		}
	}
	.active {
		.name,
		.content {
			color: #333;
		}
	}
}
.bjt {
	background-image: url(@/static/images/bjt.png);
	background-repeat: no-repeat;
	background-size: 100% auto;
}
.statistics {
	padding: 32rpx 8rpx 22rpx;
	.label {
		height: 42rpx;
		line-height: 42rpx;
		font-size: 28rpx;
	}
	.red {
		margin-right: 40rpx;
		line-height: 42rpx;
		font-size: 32rpx;
		color: $color-red;
	}
}
